@import 'variables'
@import 'mixins'
@import 'nib'

left-margin = 12px

.code-style
  font-family: mono-font-family
  font-size: 16px
  line-height: 23px
  -webkit-font-smoothing: initial

.CodeMirror
  font-family: mono-font-family
  cursor: text

.CodeMirror
  &.cm-s-neo, &.cm-s-css
    color: #2E383C
    .cm-comment
      color: #C0C4CA
    .cm-keyword, .cm-property
      color: #3498DB
    .cm-atom, .cm-number
      color: #9B59B6
    .cm-node, .cm-tag
      color: #E74C3C
    .cm-string
      color: #E67E22
    .cm-variable, .cm-qualifier
      color: #1ABC9C

#grass
  .CodeMirror
    font-size: 14px
    line-height: 18px

#editor
  &.file-loaded
    .CodeMirror
      margin-right: left-margin
  .CodeMirror
    background-color: #fff
    padding: 12px
    border-radius: 4px
    margin: 12px 124px 12px left-margin
    transist: all
    @extend .code-style
    pre
      padding: 0
    .CodeMirror-placeholder
      color: #E0E2E6
  .CodeMirror-lines
    padding: 0
  .CodeMirror-gutters
    border: none
    border-right: 10px solid transparent
    background-color: transparent
  .CodeMirror-linenumber
    padding: 0
    color: #E0E2E5
    opacity: 1
  .CodeMirror
    height: auto
  .CodeMirror-scroll
    overflow: hidden
    max-height: 140px
  .CodeMirror div.CodeMirror-cursor
    border-left: 11px solid rgba(155, 157, 162, 0.37)
    z-index: 3

  // Smooth transition from multi-line to one-line
  .CodeMirror-sizer
    transist min-height
  .CodeMirror-scroll div:nth-child(2)
    transist top

  .prompt
    absolute: top 24px left (left-margin + 34px)
    color: #93969b
    opacity: 0
    z-index: 100

  .one-line
    .prompt
      opacity: 1
    .CodeMirror .CodeMirror-linenumber
      opacity: 0

  .disable-highlighting
    .CodeMirror .CodeMirror-code *
      color: #7B7F89

  .cypher-hints
    width: .8em

  .gutter-warning
    color: color-warning-on-white
    opacity: .6
    font-size: 14px
    line-height: 23px
    display: inherit
    cursor: pointer
